<template>
  <div class="service-detail">
    <div class="banner container-fuild text-center">律师服务</div>
    <div class="container">
      <el-card class="box-card">
        <div slot="header" class="clearfix">
          <span>沈阳皇姑区案源委托详情 <i class="time">2021-08-30</i></span>
        </div>
        <div class="card-container">
          <div class="pull-left">
            <img src="../assets/img/laywer.png" alt="">
            <span>登录后才可以查看发布 方的具体联系方式哦！</span>
          </div>
          <div class="pull-middle">
            <p>求助信息的事由：<span>王莉</span></p>
            <p>求助信息的结束标准：<span>20万元</span></p>
            <p>求助信息代理价格：<span>20万元</span></p>
            <p>信息对应的管理编码（ID）：<span>ZQ571537535</span></p>
          </div>
          <div class="pull-right">
            <p>求助信息的诉讼内容：<span>王莉</span></p>
            <p>求助信息的执行地区：<span>20万元</span></p>
            <p>发布时间：<span>2021-08-15</span></p>
            <p>债务人所在地址：<span style="color: red;">辽宁省沈阳市</span></p>
          </div>
        </div>
        <div class="evd-container">
          <p>详细描述：<span>被执行人在沈阳本地，详情见法律文书</span></p>
          <p>证据信息：</p>
          <div>
            <img src="@/assets/img/ball.png" alt="">
            <img src="@/assets/img/ball.png" alt="">
            <img src="@/assets/img/ball.png" alt="">
          </div>
        </div>
      </el-card>
    </div>
  </div>
</template>
<script>
import { WOW } from "wowjs";
export default {
  name: "CaseDetail",
  data() {
    return {
      id: "",
      logined: false
    };
  },
  mounted() {
    this.id = this.$route.params.id || 123;
    var wow = new WOW();
    wow.init();
  },
  methods: {
    viewPay() {

    },
    getDataDetail(data){
        this.$util.post('api/entrustment/getEntrustmentInfo?entrustId='+data,{}).then(res=>{
          console.log(res)
        })
    }

  }
};
</script>
<style scoped>
.banner {
  color: #fff;
  font-size: 30px;
  height: 300px;
  line-height: 150px;
  background-image: url("../assets/img/banner_2.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: scroll;
  background-position: center center;
}
.container {
  margin: 40px auto;
}
.time {
  font-weight: 400;
  margin-left: 20px;
}
.card-container {
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid #ccc;
  padding: 20px 0;
}
.pull-left {
  width: 120px;
  height: 200px;
  display: flex;
  flex-direction: column;
}
.pull-left img {
  width: 100%;
  height: 160px;
}
.pull-left span {
  font-weight: 400;
  color: #333;
  font-size: 12px;
  margin-top: 5px;
}
.pull-middle {
  display: flex;
  flex-direction: column;
}
.pull-middle span {
  margin-top: 10px;
}
.pay-box {
  width: 160px;
  margin: 10px auto;
  height: 80px;
  display: flex;
  justify-content: space-between;
}
.pay-box img {
  width: 40px;
  height: 40px;
}
.pay-box span {
  color: #ccc;
  font-size: 12px;
}
.evd-container {
  padding: 20px 0;
}
.evd-container div {
  display: flex;
}
.evd-container img {
  width: 150px;
  height: 150px;
  margin-right: 10px;
}
</style>
